<template>
  <div>
    <el-dialog :visible.sync="value" :before-close="() => $emit('closeDialog', false)">
      <template slot="title">
        <span  v-if="multipleSelection.length > 0">批量</span> 转账异常处理
      </template>
      <el-form :model="form" ref="refForm" label-width="180px" v-show="multipleSelection.length <= 0">
        <el-form-item label="账户名">
          <el-col :span="16">
            <el-input :value="rowData.username" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="游戏账户名">
          <el-col :span="16">
            <el-input :value="rowData.gameUsername" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="转账时间">
          <el-col :span="16">
            <el-input :value="rowData.createTime | toTime" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="来自">
          <el-col :span="16">
            <el-input :value="rowData.fromChannelId | toConverter('TRANSFER_PLATFORMS')" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="转至">
          <el-col :span="16">
            <el-input :value="rowData.toChannelId | toConverter('TRANSFER_PLATFORMS')" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="转账金额">
          <el-col :span="16">
            <el-input :value="rowData.amount" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="转账单号">
          <el-col :span="16">
            <el-input :value="rowData.tradeId" disabled></el-input>
          </el-col>
        </el-form-item>
      </el-form>
      <el-row class="footer-row">
        <el-col :span="12" style="text-align: right;">
          如果人工查询确认成功，请点击：
        </el-col>
        <el-col :span="12" style="text-align: left;">
          <el-button type="success" @click="remindShow(1)" :loading="loading">
            游戏平台转账成功
          </el-button>
        </el-col>
      </el-row>
      <el-row class="footer-row">
        <el-col :span="12" style="text-align: right;">
          如果人工查询确认失败，请点击：
        </el-col>
        <el-col :span="12" style="text-align: left;">
          <el-button type="danger" @click="remindShow(2)" :loading="loading">
            游戏平台转账失败
          </el-button>
        </el-col>
      </el-row>
      <el-row class="footer-pad">
        <el-col :span="24" style="text-align: center;" class="tips">
          游戏平台转账成功：核实第三方平台已收到此笔转账，点击按钮，则转账状态变更为成功
        </el-col>
      </el-row>
      <el-row class="">
        <el-col :span="24" style="text-align: center;" class="tips">
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;游戏平台转账失败：核实第三方平台为收到此笔转账，点击按钮，则将转账金额退回中心钱包
        </el-col>
      </el-row>
    </el-dialog>
    <el-dialog :visible="remind"  :before-close="()=>remind = false">
      <template slot="title">确认转账异常处理</template>
      <div>确定需要对此笔异常转账进行处理？</div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="remind = false">取 消</el-button>
        <el-button type="primary" @click="checkHandler">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {getTransferDetail, updateTransferStatus} from "@/services/api/transfer";

  import {form, factory} from '@/build';

  export default {

    name: 'exception-dialog',

    props: ['value', 'id','rowData' , 'multipleSelection'],

    mixins: [form, factory],

    data() {
      return {
        remind:false,
        form: {
          id: this.id,
          status: undefined,
        },
      }
    },
    computed:{
    },
    methods: {
      remindShow(status){
        this.form.status= status
        this.remind = true
      },
      checkHandler(){
        this.doSave({action: 'saveForm', form: 'refForm'})
      }
    },
    mounted() {
      this.bindSave(updateTransferStatus, 'saveForm', 'form', {
        beforeSend: data=>{
          let tradeId = this.rowData.tradeId
          let tradeIdArr=[];
          if(this.multipleSelection.length > 0){
            this.multipleSelection.map((item,index)=>{
              tradeIdArr.push(item.tradeId)
            })
            return {orderId:tradeIdArr.join(","),status:this.form.status}
          }
          return {...data,orderId:tradeId}
        },
        afterSuccess: () => {
          this.$emit('closeDialog', false);
          this.$parent.gridSearch();
        }
      });
    },
  }
</script>

<style lang="scss" scoped>
  .footer-row{
    padding: 10px;
  }
  .footer-pad{
    padding-top: 10px;
  }
  .tips{
    color: red;
    font-size:12px;
  }
</style>
